<template>
	<MyTemplate  >
		<div class="my-map" style="overflow: hidden">
      <!--  地图    -->
      <div id="cesiumDiv"  ref="cesiumDiv">
        <div ref="rollerShutterSlider" v-if="rollerShutter!=0"  :class="rollerShutter==2?'horizontal-slider': 'vertical-slider'"
             @mousedown="sliderMouseDown($event)"
        @mouseup="sliderMouseUp($event)"></div>
      </div>

			<!-- 电子地图右上角顶级导航菜单 -->
			<div class="buttonBox">
				<div>

          <div class="dv-border-box1" v-if="dvBoxFlag != 'analysis' " @click="dvBoxClick('analysis')">
            <div class="el-icon-data-analysis"></div>
            <div>分析</div>
          </div>
          <div class="dv-border-box1-select" v-if="dvBoxFlag == 'analysis' " @click="dvBoxClick('')">
            <div class="el-icon-data-analysis"></div>
            <div>分析</div>
          </div>

          <div class="lsw-split-line"></div>

          <div class="dv-border-box1" v-if="dvBoxFlag != 'rain' " @click="dvBoxClick('rain')">
            <div class="el-icon-heavy-rain"></div>
            <div>环境</div>
          </div>
          <div class="dv-border-box1-select" v-if="dvBoxFlag == 'rain' " @click="dvBoxClick('')">
            <div class="el-icon-heavy-rain"></div>
            <div>环境</div>
          </div>

          <div class="lsw-split-line"></div>
          <div class="dv-border-box1" v-if="!showSplitLayer" @click="addSplitLayer('shutter')">
            <div class="el-icon-reading"></div>
            <div>卷帘</div>
          </div>
          <div class="dv-border-box1-select" v-if="showSplitLayer" @click="removeSplitLayer('')">
            <div class="el-icon-reading"></div>
            <div>卷帘</div>
          </div>

          <div class="lsw-split-line"></div>
					<div class="dv-border-box1" v-if="dvBoxFlag != 'location' " @click="dvBoxClick('location')">
						<div class="el-icon-location-information"></div>
						<div>定位</div>
					</div>
					<div class="dv-border-box1-select" v-if="dvBoxFlag == 'location' " @click="dvBoxClick('')">
						<div class="el-icon-location-information"></div>
						<div>定位</div>
					</div>

					<div class="lsw-split-line"></div>

					<div class="dv-border-box1" @click="png()">
						<div class="el-icon-picture-outline"></div>
						<div>打印</div>
					</div>
					<div class="lsw-split-line"></div>

					<div class="dv-border-box1" v-if="dvBoxFlag != 'rosca' " @click="dvBoxClick('rosca')">
						<div class="el-icon-edit"></div>
						<div>标绘</div>
					</div>
					<div class="dv-border-box1-select" v-if="dvBoxFlag == 'rosca' " @click="dvBoxClick('')">
						<div class="el-icon-edit"></div>
						<div>标绘</div>
					</div>

					<div class="lsw-split-line"></div>

					<div class="dv-border-box1" v-if="dvBoxFlag != 'measure' " @click="dvBoxClick('measure')">
						<div class="el-icon-rank"></div>
						<div>测量</div>
					</div>
					<div class="dv-border-box1-select" v-if="dvBoxFlag == 'measure' " @click="dvBoxClick('')">
						<div class="el-icon-rank"></div>
						<div>测量</div>
					</div>

					<div class="lsw-split-line"></div>

					<div class="dv-border-box1" v-if="dvBoxFlag != 'collection' " @click="dvBoxClick('collection')">
						<div class="el-icon-star-off"></div>
						<div>收藏</div>
					</div>
					<div class="dv-border-box1-select" v-if="dvBoxFlag == 'collection' " @click="dvBoxClick('')">
						<div class="el-icon-star-off"></div>
						<div>收藏</div>
					</div>

					<div class="lsw-split-line"></div>
					<div class="dv-border-box1" v-if="dvBoxFlag != 'attribute' "
						@click="dvBoxClick('attribute'),locationClick()">
						<div class="el-icon-document"></div>
						<div>属性</div>
					</div>
					<div class="dv-border-box1-select" v-if="dvBoxFlag == 'attribute' " @click="dvBoxClick('')">
						<div class="el-icon-document"></div>
						<div>属性</div>
					</div>

          <div class="lsw-split-line"></div>

          <div class="dv-border-box1" v-if="dvBoxFlag != 'shadows' "
               @click="dvBoxClick('shadows')">
            <div class="el-icon-sunny"></div>
            <div>光照</div>
          </div>
          <div class="dv-border-box1-select" v-if="dvBoxFlag == 'shadows' " @click="dvBoxClick('')">
            <div class="el-icon-sunny"></div>
            <div>光照</div>
          </div>

          <div class="lsw-split-line"></div>

          <div class="dv-border-box1" @click="initial()">
						<div class="el-icon-location-outline"></div>
						<div>初始</div>
					</div>
				</div>

				<div class="operationBox">
          <div v-if="dvBoxFlag == 'shadows' ">
            <el-time-picker
                v-model="shadowsTime"
                :picker-options="{selectableRange: '' }"
                placeholder="任意时间点"
                @change="shadowsChange">
            </el-time-picker>
          </div>

					<!--框选-->
					<div v-if="dvBoxFlag == 'circleSelect' ">
						<div
							style="position: absolute; right: 5px; height: 400px; width: 400px; border-radius: 4px;
          border: 1px solid #005aca;  background-color: #F5F7FA;color: #909399;">
						</div>
						<div style="position: absolute; right: 5px; width: 400px; height: 500px;">
              <div class="lsw-scroll" style="height: 90%; text-align: center">
                <div v-for="(item,index) in boxSelectData">
                  <el-row style="margin-top: 10px;">
                    <el-col :span="10">
                      {{item.index}}
                    </el-col>
                    <el-col :span="12">
                      {{item.label}}
                    </el-col>
                  </el-row>
                </div>
              </div>
						</div>
					</div>

          <!-- 分析 -->
          <div v-show="dvBoxFlag == 'analysis'">
            <div style="position: absolute; right: 5px; height: 50px; width: 180px; border-radius: 4px;
          border: 1px solid #005aca;  background-color: #F5F7FA;color: #909399;">
            </div>
            <div :class="[analysisValue == 'pointToOpposite' ? 'dv-border-box1-select' : 'dv-border-box1']" @click="circleAnalysisStart()">
              <div style="height: 5px;"></div>
              <div>通视(点对面)</div>
            </div>
            <div :class="[analysisValue == 'pointToPoint' ? 'dv-border-box1-select' : 'dv-border-box1']" @click="singleLineAnalysisStart()">
              <div style="height: 5px;"></div>
              <div>通视(点对点)</div>
            </div>
          </div>

          <!-- 雨雪 -->
          <div v-show="dvBoxFlag == 'rain'">
            <div style="position: absolute; right: 5px; height: 50px; width: 150px; border-radius: 4px; border: 1px solid #005aca;  background-color: #F5F7FA;color: #909399;">
            </div>
            <div :class="[snowShow ? 'dv-border-box1-select' : 'dv-border-box1']" @click="snow(!snowShow)">
              <div style="height: 5px;"></div>
              <div>雪</div>
            </div>
            <div :class="[rainShow ? 'dv-border-box1-select' : 'dv-border-box1']" @click="rain(!rainShow)">
              <div style="height: 5px;"></div>
              <div>雨</div>
            </div>
<!--            <div :class="[fogShow ? 'dv-border-box1-select' : 'dv-border-box1']" @click="fog(!fogShow)">-->
<!--              <div style="height: 5px;"></div>-->
<!--              <div>雾</div>-->
<!--            </div>-->
          </div>

					<!-- 定位 -->
					<div v-show="dvBoxFlag == 'location'">
						<el-cascader :options="optionsLocation" :props="{ checkStrictly: true }" clearable
							@change="locationChange"></el-cascader>
					</div>

					<!-- 工具 -->
					<div v-show="dvBoxFlag == 'tool'">
						<div
							style="position: absolute; right: 5px; height: 50px; width: 235px; border-radius: 4px;
          border: 1px solid #005aca;  background-color: #F5F7FA;color: #909399;">
						</div>
						<div class="dv-border-box1" @click="stopReset()">
							<div style="height: 5px;"></div>
							<div>停止</div>
						</div>

						<div class="lsw-split-line"></div>

						<div class="dv-border-box1" @click="transcribe()">
							<div style="height: 5px;"></div>
							<div>录制</div>
						</div>

						<div class="lsw-split-line"></div>

						<div class="dv-border-box1" @click="png()">
							<div style="height: 5px;"></div>
							<div>截图</div>
						</div>

					</div>

					<!-- 收藏 -->
					<div v-show="dvBoxFlag == 'collection'">

						<div
							style="position: absolute; right: 10px; height: 50px; width: 140px; border-radius: 4px;
          border: 1px solid #005aca;  background-color: #F5F7FA;color: #909399;">
						</div>
						<div class="dv-border-box1" v-if="dvBoxTwoFlag != 'choice' " @click="dvBoxTwoClick('choice')">
							<div style="height: 5px;"></div>
							<div>选择</div>
						</div>
						<div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'choice' " @click="dvBoxTwoClick('')">
							<div style="height: 5px;"></div>
							<div>选择</div>
						</div>

						<div class="lsw-split-line"></div>

						<div class="dv-border-box1" v-if="dvBoxTwoFlag != 'save' " @click="dvBoxTwoClick('save')">
							<div style="height: 5px;"></div>
							<div>保存</div>
						</div>
						<div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'save' " @click="dvBoxTwoClick('')">
							<div style="height: 5px;"></div>
							<div>保存</div>
						</div>

						<div class="operationBox">
							<el-row v-if="dvBoxTwoFlag == 'choice' ">
								<el-col :span="8" :push="12">
									<el-select v-model="valueChoice" placeholder="请选择" @change="changeCollection">
										<el-option v-for="item in optionsChoice" :key="item.id"
											:label="item.collectName" :value="item.id">
										</el-option>
									</el-select>
								</el-col>
								<el-col :span="4" :push="12">
									<el-button type="primary" @click="delCollection">删除</el-button>
								</el-col>
							</el-row>

							<el-row v-if="dvBoxTwoFlag == 'save' ">
								<el-col :span="8" :push="12">
									<el-input v-model="collectionName" placeholder="请输入收藏名称"></el-input>
								</el-col>
								<el-col :span="4" :push="12">
									<el-button type="primary" @click="addCollection">确定</el-button>
								</el-col>
							</el-row>
						</div>
					</div>

					<!-- 测量 -->
					<div v-show="dvBoxFlag == 'measure'">
						<div
							style="position: absolute; right: 5px; height: 50px; width: 400px; border-radius: 4px;
          border: 1px solid #005aca; background-color: #F5F7FA;color: #909399;">
						</div>
						<div class="dv-border-box1" @click="measureClear()">
							<div style="height: 5px;"></div>
							<div>清除</div>
						</div>
						<div class="lsw-split-line"></div>
						<div class="dv-border-box1" v-if="dvBoxTwoFlag != 'third' " @click="dvBoxTwoClick('third')">
							<div style="height: 5px;"></div>
							<div>面积测量</div>
						</div>
						<div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'third' " @click="dvBoxTwoClick('')">
							<div style="height: 5px;"></div>
							<div>面积测量</div>
						</div>
						<div class="lsw-split-line"></div>
						<div class="dv-border-box1" v-if="dvBoxTwoFlag != 'second' " @click="dvBoxTwoClick('second')">
							<div style="height: 5px;"></div>
							<div>距离测量</div>
						</div>
						<div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'second' " @click="dvBoxTwoClick('')">
							<div style="height: 5px;"></div>
							<div>距离测量</div>
						</div>
						<div class="lsw-split-line"></div>
						<div class="dv-border-box1" v-if="dvBoxTwoFlag != 'first' " @click="dvBoxTwoClick('first')">
							<div style="height: 5px;"></div>
							<div>高度测量</div>
						</div>
						<div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'first' " @click="dvBoxTwoClick('')">
							<div style="height: 5px;"></div>
							<div>高度测量</div>
						</div>

            <div class="lsw-split-line"></div>

            <div class="dv-border-box1" v-if="dvBoxTwoFlag != 'zero' " @click="dvBoxTwoClick('zero')">
              <div style="height: 5px;"></div>
              <div>坐标获取</div>
            </div>
            <div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'zero' " @click="dvBoxTwoClick('')">
              <div style="height: 5px;"></div>
              <div>坐标获取</div>
            </div>
					</div>

					<!-- 标绘 -->
					<div v-show="dvBoxFlag == 'rosca'  ">
						<div class="lsw-pop-up-box">
							<el-row>
								<el-col :span="24">
									<div class="dv-border-box1" @click="Clear()">
										<div style="height: 5px;"></div>
										<div>清除</div>
									</div>
									<div class="lsw-split-line"></div>
									<div class="dv-border-box1" v-if="dvBoxTwoFlag != 'bianji' "
										@click="dvBoxTwoClick('bianji')">
										<div style="height: 5px;"></div>
										<div>编辑</div>
									</div>
									<div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'bianji' "
										@click="dvBoxTwoClick('')">
										<div style="height: 5px;"></div>
										<div>编辑</div>
									</div>
                  <div class="lsw-split-line"></div>
                  <div class="dv-border-box1" v-if="dvBoxTwoFlag != 'baocun' "
                       @click="dvBoxTwoClick('baocun')">
                    <div style="height: 5px;"></div>
                    <div>保存</div>
                  </div>
                  <div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'baocun' "
                       @click="dvBoxTwoClick('')">
                    <div style="height: 5px;"></div>
                    <div>保存</div>
                  </div>

									<div class="lsw-split-line"></div>

									<div class="dv-border-box1" @click="plottingDel()">
										<div style="height: 5px;"></div>
										<div>删除</div>
									</div>

									<div class="lsw-split-line"></div>

									<div class="dv-border-box1" v-if="dvBoxTwoFlag != 'xinjian' "
										@click="dvBoxTwoClick('xinjian'),plottingNew()">
										<div style="height: 5px;"></div>
										<div>新建</div>
									</div>
									<div class="dv-border-box1-select" v-if="dvBoxTwoFlag == 'xinjian' "
										@click="dvBoxTwoClick(''),plottingNew()">
										<div style="height: 5px;"></div>
										<div>新建</div>
									</div>

									<div class="lsw-split-line"></div>

									<!-- 选择图层 -->
									<div class="coverage" style="float: right; width: 150px;">
										<el-select v-model="coverageValue" placeholder="请选择图层" @change="changeCoverage">
											<el-option v-for="item in coverage" :key="item.value" :label="item.label"
												:value="item.value">
											</el-option>
										</el-select>
									</div>
								</el-col>
							</el-row>
						</div>
						<div class="lsw-pop-up-box" v-if="dvBoxTwoFlag == 'bianji' ">
							<el-row>
								<el-col :span="24">
									<div class="dv-border-box1" @click="None()">
										<div style="height: 5px;"></div>
										<div>取消绘制</div>
									</div>
									<div class="lsw-split-line"></div>
									<div class="dv-border-box1" v-if="dvBoxThreeFlag != 'third1' "
										@click="dvBoxThreeClick('third1')">
										<div style="height: 5px;"></div>
										<div>面</div>
									</div>
									<div class="dv-border-box1-select" v-if="dvBoxThreeFlag == 'third1' "
										@click="dvBoxThreeClick('')">
										<div style="height: 5px;"></div>
										<div>面</div>
									</div>
									<div class="lsw-split-line"></div>
									<div class="dv-border-box1" v-if="dvBoxThreeFlag != 'second1' "
										@click="dvBoxThreeClick('second1')">
										<div style="height: 5px;"></div>
										<div>线</div>
									</div>
									<div class="dv-border-box1-select" v-if="dvBoxThreeFlag == 'second1' "
										@click="dvBoxThreeClick('')">
										<div style="height: 5px;"></div>
										<div>线</div>
									</div>
									<div class="lsw-split-line"></div>
									<div class="dv-border-box1" v-if="dvBoxThreeFlag != 'first1' "
										@click="dvBoxThreeClick('first1')">
										<div style="height: 5px;"></div>
										<div>点</div>
									</div>
									<div class="dv-border-box1-select" v-if="dvBoxThreeFlag == 'first1' "
										@click="dvBoxThreeClick('')">
										<div style="height: 5px;"></div>
										<div>点</div>
									</div>
                  <div class="lsw-split-line"></div>
                  <div class="dv-border-box1" v-if="dvBoxThreeFlag != 'four1' "
                       @click="dvBoxThreeClick('four1')">
                    <div style="height: 5px;"></div>
                    <div>文字</div>
                  </div>
                  <div class="dv-border-box1-select" v-if="dvBoxThreeFlag == 'four1' "
                       @click="dvBoxThreeClick('')">
                    <div style="height: 5px;"></div>
                    <div>文字</div>
                  </div>
                  <el-input v-show="dvBoxThreeFlag == 'four1'" placeholder="请输入文字描述" v-model="pointText"></el-input>

								</el-col>
							</el-row>
						</div>
						<div class="lsw-pop-up-box" v-if="dvBoxTwoFlag == 'xinjian' ">
							<el-input v-model="plottingInput" placeholder="新建图层" @blur="plottingNewClick()"
								@change="plottingNewFlag =false"></el-input>
						</div>
					</div>
          <!-- 属性 -->
					<div v-if="dvBoxFlag == 'attribute'" class="lsw-pop-up-box">
						<div class="lsw-scroll" style="height: 90%;">
							<el-row style="margin-top: 10px;">
								<el-col :span="10" style="text-align: center;">
									名称
								</el-col>
								<el-col :span="10" style="text-align: center;">
									{{this.reverseQueryData.name}}
								</el-col>
							</el-row>

              <el-row style="margin-top: 10px;">
                <el-col :span="10" style="text-align: center;">
                  简称
                </el-col>
                <el-col :span="10" style="text-align: center;">
                  {{this.reverseQueryData.shortName}}
                </el-col>
              </el-row>

<!--							<el-row style="margin-top: 10px;">-->
<!--								<el-col :span="10" style="text-align: center;">-->
<!--									类型-->
<!--								</el-col>-->
<!--								<el-col :span="10" style="text-align: center;">-->
<!--									{{this.reverseQueryData.level}}-->
<!--								</el-col>-->
<!--							</el-row>-->

							<el-row style="margin-top: 10px;">
								<el-col :span="10" style="text-align: center;">
									地址
								</el-col>
								<el-col :span="10" style="text-align: center;">
									{{this.reverseQueryData.detailedAddress}}
								</el-col>
							</el-row>

							<el-row style="margin-top: 10px;">
								<el-col :span="10" style="text-align: center;">
									经纬度
								</el-col>
								<el-col :span="10" style="text-align: center;">
									{{this.reverseQueryData.location}}
								</el-col>
							</el-row>

						</div>
					</div>
				</div>
			</div>

			<!--   左上角搜索功能   -->
			<div class="map-search" ref="cesiumDivA">
				<el-form :model="form">
					<el-input v-model="form.search" placeholder="请输入搜索内容" style="width: 400px">
						<el-button slot="append" icon="el-icon-search" @click="fuzzyMatching()"></el-button>
						<el-button slot="append" icon="el-icon-delete" @click="Clear()"></el-button>
					</el-input>
				</el-form>
			</div>
      <div class="lsw-geocoding-box-table" v-if="tableFlag == '1'">
        <el-table :data="locationInfos" border :highlight-current-row="true"
                  :header-cell-style="{'text-align':'center','backgroundColor':'#005aca','color':'#ffffff','border':'1px solid #ebeef5'}"
                  @row-click="locationInfos1RowClick"
                  style="width: 100%; border: 1px solid #005aca; font-size: 12px; padding: 0px;">
          <el-table-column prop="name" align="center" label="地名" width="120">
          </el-table-column>
          <el-table-column prop="detailedAddress" align="center" label="地名地址">
          </el-table-column>
          <el-table-column prop="lng" align="center" label="经度" width="90">
          </el-table-column>
          <el-table-column prop="lat" align="center" label="纬度" width="90">
          </el-table-column>
        </el-table>
      </div>
      <div class="lsw-geocoding-box-table1" v-if="tableFlag == '1'">
        <div style="position: relative;left: 400px;color: black;">共 {{locationInfos.length}} 条</div>
      </div>
			<!--  地图切换    -->
      <mapSwitch class="map-layers-cut" :defaultTab="mapIndex" @on-click="mapTab"></mapSwitch> <!-- 地图切换 -->
		</div>
	</MyTemplate>
</template>

<script>
  let draw;
  let vector;

  let url;

  let drawHandleTool; //标绘
  let analysis; //分析

  let handlerlj //路径
  let handlerljjs = 0 //路径
  let handlerLocation

  let inter = null //太阳光

  import MapSwitch from '../mapSwitch.vue'
	import MyTemplate from "@/components/my-template";
	import $axios from "@/network";
	import $axios1 from "@/network/shiyong.js";

	/**
	 *{ 在线地图 }
	 * @param:
	 * @author: 宋康
	 * @DateTime: 2022/7/8
	 */
	export default {
		name: "index",
		components: {
      MapSwitch,
			MyTemplate,
		},
		data() {
			return {
        // 地图图层列表
        basemapLayers:[
          {// 矢量
            id:'vec',
            layers:[
              {
                name:'vecProvider',
                type:1,
                param:{
                  // url: 'http://localhost/static/haigangqu/TDT_Cache_vec_w/{z}/{x}/{y}.png',
                  url: 'http://172.16.210.4/mapcache/TDT_Cache_vec_w/{z}/{x}/{y}.png',
                  maximumLevel: 18
                },
                provider:null
              },{
                name:'cvaProvider',
                type:1,
                param:{
                  url: 'http://172.16.210.4/mapcache/TDT_Cache_cva_w/{z}/{x}/{y}.png',
                  maximumLevel: 18
                },
                provider:null
              },{
                name:'vecQuanyu',
                type:1,
                param:{
                  // url: 'http://192.168.8.200/luanzhou/map_cache/cache_vec_quanyu/{z}/{x}/{y}.png',
                  url: 'http://172.16.210.4/mapcache/cache_vec/{z}/{x}/{y}.png',
                  maximumLevel: 18
                },
                provider:null
              }
            ]
          },
          {// 影像
            id:'img',
            layers:[
              {
                name:'imgProvider',
                type:1,
                param:{
                  url: 'http://172.16.210.4/mapcache/tdt_cache_img/{z}/{x}/{y}.png',
                  // url: 'http://localhost/static/luanzhou/TDT_Cache_Mercator/{z}/{x}/{y}.jpg',
                  maximumLevel: 18
                },
                provider:null
              },
              {
                name:'ciaProvider',
                type:1,
                param:{
                  // url: 'http://192.168.8.200/luanzhou/map_cache/TDT_Cache_cia_w/{z}/{x}/{y}.png',
                  url: 'http://172.16.210.4/mapcache/tdt_cache_cia/{z}/{x}/{y}.png',
                  maximumLevel: 18
                },
                provider:null
              },
              {
                name:'domChengqu',
                type:1,
                param:{
                  // url: 'http://192.168.8.200/luanzhou/map_cache/DOM_cache/{z}/{x}/{y}.png',
                  url: 'http://172.16.210.4/mapcache/dom_cache/{z}/{x}/{y}.png',
                  // minimumLevel: 16,
                  maximumLevel: 17
                },
                provider:null
              }
            ]
          },
          {// 地形
            id: 'ter',
            layers: []
          }
        ],
        mapIndex:3, // 当前图层序号
        layers_base:[],
        layers_3d:[],

        analysisValue: "",
        pointText: "",
        // 天气模拟
        weatherEffect:null,
        rainShow: false,
        snowShow: false,
        fogShow: false,
        // 空间测量
        mdTool:null, // 测距
        mhTool:null,// 测高
        maTool:null,// 测面
        entityDraw:null,
        // 卷帘显示
        showSplitLayer:false,
        // 通视性分析
        singleLineAnalysis:null,
        circleAnalysis:null,
        oldRow: {},


        waterMatList:[],
        // 卷帘显示状态 0 关闭 1左右 2上下
        rollerShutter : 0,
        rollerShutterConfig:{},
        evLayers:[],
				//屏幕录制参数
				form: {
					search: "",
				},
				btnshow: true,
				btnhide: false,
				clickBtn: false,
				clickBtn2: false,
				clickBtn3: false,
				color1: "#409EFF",
				px: "5",
				draw: [{
					label: "标绘",
					children: [{
							label: "点",
							// children: [{}],
						},
						{
							label: "线",
						},
						{
							label: "面",
						},
						{
							label: "模型",
						},
					],
				}
        ],
				cub: ["1", "2"],
				areas: ["1"],
				coverage: [],
				coverageId: "",
				coverageValue: "",
				clickColor: "1",
				originX: 0,
				originY: 0,
				clickdraw: null,
				tk: "",
				//接口参数
				type: "",
				plott: "",
				plottDataId: "1",
				decide: "true",
				borderactive: "4",

				dvBoxFlag: '',
				dvBoxTwoFlag: '',

				optionsLocation: [
          {
            value: '海港区',
            label: '海港区',
            area: '县.json',
            code: "130274",
            lng: '118.990037',
            lat: '39.7803993',
            children: [
              {
                value: '港城街道',
                label: '港城街道',
                area: '乡.json',
                code:'130274451000',
                lng: '118.7030029',
                lat: '39.7444992'
              },
              {
                value: '王滩镇',
                label: '王滩镇',
                area: '乡.json',
                code:'130274103000',
                lng: '118.7710037',
                lat: '39.7705002'
              },
              {
                value: '京唐港',
                label: '京唐港',
                area: '乡.json',
                code:'130274451003',
                lng: '118.7710037',
                lat: '39.7705002'
              },
              {
                value: '物流园区',
                label: '物流园区',
                area: '乡.json',
                code:'130274451002',
                lng: '118.6829987',
                lat: '39.7518005'
              },
              {
                value: '东部工业园区',
                label: '东部工业园区',
                area: '乡.json',
                code:'130274451001',
                lng: '118.7580032',
                lat: '39.6663017'
              },
              {
                value: '大清河',
                label: '大清河',
                area: '乡.json',
                code:'130274455000',
                lng: '118.6589966',
                lat: '39.8223000'
              }
            ]
          }
        ], //定位数组
				collectionName: '', //收藏名
				optionsChoice: [], //选择数组
				valueChoice: '', //选中的收藏
				valueChoiceId: '', //选中收藏的ID
				plottingNewFlag: false,
				plottingInput: '',

				//纠错
				errorTextarea: '',
				errorPhone: '',
				errorMailbox: '',
				dvBoxThreeFlag: '',
				errorData: [],
				correctorId: 1,
				corrector: "lishiwei",
				unit: "单位",
				address: "地址",
				serviceId: 1,
				serviceName: "基础地图",
				serviceType: "在线地图",
				serviceDepartment: "基础地图",
				serviceTopics: "基础地图",
				serviceStatus: "在线",
				personId: 1,
				person: "管理员",
				errorDate: "2022-09-01",
				state: "未处理",
				errorCoordinate: "", //替换坐标
				recordId: "", //修改点的ID
				operation: "1", //操作类型1添加2修改3删除
				attribute: "",
				//纠错结束
				locationInfos: [], //搜索数组
				tableFlag: '0', //搜索
				zb: [], //路径
				switchValue: 'vec',

				optionsError: [
            {
					value: '1',
					label: '文化教育'
				}, {
					value: '2',
					label: '医疗卫生'
				}, {
					value: '3',
					label: '人力资源'
				}, {
					value: '4',
					label: '自然资源'
				}, {
					value: '气象',
					label: '气象'
				}
        ],
				valueError: '',

				tcData: [
            {
						a: "经度",
						b: "146.63",
					},
					{
						a: "纬度",
						b: "43.52",
					},
					{
						a: "种类",
						b: "种类",
					}
				],
				reverseQueryData: [],
				lng: "",
				lat: "",
				boxSelectData: [{},{}],

        shadowsTime: "",//光照时间

        queryResults : [], //查询结果

        tucengData: [],
        oldNew: "新",
      };
		},
    watch: {

    },

    mounted() {
      //加载地图
      this.webGlobe();
    },
		methods: {
      //地图相关初始化
      webGlobe() {
        let that = this
        window.xt3dInit = {
          init(el){
            this.initViewer(el)
            // that.add3DTiles();
            // 切换视角
            // that.setInitView();

          },
          initViewer(el) {
            const basemapLayer = that.basemapLayers[1]
            const imgProvider = that.getLayer(basemapLayer.layers[0])
            const ciaProvider = that.getLayer(basemapLayer.layers[1])
            const domChengquProvider = that.getLayer(basemapLayer.layers[2])
            //加载地图
            window.viewer = new Cesium.Viewer(el, {
              imageryProvider: imgProvider,
              animation: false,
              baseLayerPicker: false,
              fullscreenButton: false,
              geocoder: false,
              homeButton: false,
              infoBox: false,
              sceneModePicker: false,
              selectionIndicator: false,
              timeline: false,
              navigationHelpButton: false,
              sceneMode: 3, //初始场景模式 1 2D模式 2 2D循环模式 3 3D模式  Cesium.SceneMode //2D 3D转换
              contextOptions: {               //通过canvas.toDataURL()实现截图需要将该项设置为true
                webgl: {
                  alpha: true,
                  depth: false,
                  stencil: true,
                  antialias: true,
                  premultipliedAlpha: true,
                  preserveDrawingBuffer: true,
                  failIfMajorPerformanceCaveat: true
                },
                allowTextureFilterAnisotropic: true
              }

            });
            window.viewer.scene.globe.depthTestAgainstTerrain = true; //默认为false
            if (Cesium.FeatureDetection.supportsImageRenderingPixelated()) {//判断是否支持图像渲染像素化处理
              window.viewer.resolutionScale = window.devicePixelRatio;
            }
            //是否开启抗锯齿
            window.viewer.scene.fxaa = true;
            window.viewer.scene.postProcessStages.fxaa.enabled = true;

            // window.viewer.scene.backgroundColor = new Cesium.Color(0.0, 0.0, 0.0, 0.0)
            // window.viewer.scene.globe.baseColor = new Cesium.Color(1.0, 1.0, 1.0, 1.0)
            // 文字无遮挡
            window.viewer.cesiumWidget.creditContainer.style.display = "none";
            //实体不遮挡
            window.viewer.scene.globe.depthTestAgainstTerrain = false;
            //相机的高度的最小值
            window.viewer.scene.screenSpaceCameraController.minimumZoomDistance = 50;
            // window.viewer.scene.screenSpaceCameraController.maximumZoomDistance = 60000;
            basemapLayer.layers[0].provider = window.viewer.imageryLayers.get(0)
            basemapLayer.layers[1].provider = window.viewer.imageryLayers.addImageryProvider(ciaProvider)
            basemapLayer.layers[2].provider = window.viewer.imageryLayers.addImageryProvider(domChengquProvider)
            // 地形
            // let terrainProvider = new Cesium.CesiumTerrainProvider({
            //   url: 'http://192.168.8.200/luanzhou/map_cache/DEM_Cache'
            // });
            // window.viewer.terrainProvider = terrainProvider
          },
        }
        window.xt3dInit.init("cesiumDiv")
        // 切换视角
        that.setInitView();
      },
      // 根据配置文件生产图层
      getLayer(layer){
        let newlayer=null
        switch (layer.type){
          case 1:// XY切片图层
            newlayer= new Cesium.UrlTemplateImageryProvider(layer.param);
            break;
          case 2:// 地形图层
            newlayer = new Cesium.CesiumTerrainProvider(layer.param);
            break;
        }
        return newlayer
      },
      // 添加倾斜摄影图层
      add3DTiles() {
        let that = this
        // 添加倾斜摄影图层
        let tileset = new Cesium.Cesium3DTileset({
          url: 'http://172.16.210.4/mapcache/tiles_cache/tileset.json'
        });
        const layers_3d_1 = window.viewer.scene.primitives.add(tileset);
        that.layers_3d.push(layers_3d_1)
      },
      // 初始化飞行
      setInitView() {
        let that = this
        //定位
        window.viewer.scene.camera.flyTo({
          destination: new Cesium.Cartesian3.fromDegrees(118, 0, 100000000),
          duration: 0,
          complete: function callback() {
            let t1 = setTimeout(function () {
              window.viewer.scene.camera.flyTo({
                destination: new Cesium.Cartesian3.fromDegrees(118.99, 39.720,50000),
                duration: 2,
                complete: function callback() {
                  clearInterval(t1);
                  let t2 = setTimeout(function () {
                    // 添加三维模型
                    that.add3DTiles();
                    window.viewer.scene.camera.flyTo({
                      destination: new Cesium.Cartesian3.fromDegrees(118.99308532, 39.22000372, 1000),
                      duration: 2,
                      orientation: {
                        heading: 0,
                        pitch: -0.5,
                        roll: 0,
                      },
                      complete: function callback() {
                        clearInterval(t2);
                      }
                    });
                  }, 2000);
                }
              });
            }, 3000);
          }
        });
      },
      //地图切换
      mapTab(index) {
        let that = this
        that.mapIndex = index
        that.borderactive = index;
        // 隐藏所有图层
        let layers = window.viewer.imageryLayers._layers
        for (let i = 0;i<layers.length;i++) {
          const layer = window.viewer.imageryLayers.get(i)
          layer.show = false
        }
        if (index < 2) {
          // 关闭动态水域
          // 关闭倾斜摄影
          that.layers_3d.forEach((layer) => {
            layer.show = false
          })
          // 切换为二维
          window.viewer.scene.mode = Cesium.SceneMode.SCENE2D;
          // 切换角度
          window.viewer.scene.camera.flyTo({
            destination: new Cesium.Cartesian3.fromDegrees(118.97976, 39.22000372, 5000),
            duration: 1
          })
          if(index==0){ // 矢量
            const basemapLayer = that.basemapLayers[0]
            basemapLayer.layers.forEach((layer) => {
              if(!layer.provider){
                // 第一次添加
                const layerProvider = that.getLayer(layer)
                layer.provider = window.viewer.imageryLayers.addImageryProvider(layerProvider)
              }else {
                layer.provider.show = true
              }
            })
          }else if(index==1){ // 影像
            const basemapLayer = that.basemapLayers[1]
            basemapLayer.layers.forEach((layer) => {
              layer.provider.show = true
            })
          }else{ // 地形

          }
        } else {
          // 切换为三维显示
          window.viewer.scene.mode = Cesium.SceneMode.SCENE3D;
          // 切换到影像图
          const basemapLayer = that.basemapLayers[1]
          basemapLayer.layers.forEach((layer) => {
            layer.provider.show = true
          })
          // 显示倾斜摄影
          that.layers_3d.forEach((layer) => {
            layer.show = true
          })
          // 切换角度
          that.initial()
        }
      },
      //分析点击选项
      analysisClick(value) {
        this.analysisValue = value;
      },

      // ==================初始化天气信息==============
      initWeatherEffect(){
        if(!this.weatherEffect){
          this.weatherEffect = new xt3d.SceneDominate.WeatherEffect(window.viewer)
        }
      },
      //雨
      rain(rainShow) {
        this.initWeatherEffect()
        this.rainShow = rainShow;
        if (rainShow) {
          this.weatherEffect.removeEffect();
          this.weatherEffect.addRainEffect();
        } else {
          this.weatherEffect.removeEffect();
        }
      },
      //雪
      snow(snowShow) {
        this.initWeatherEffect()
        this.snowShow = snowShow;
        if (snowShow) {
          this.weatherEffect.removeEffect();
          this.weatherEffect.addSnowEffect();
        } else {
          this.weatherEffect.removeEffect();
        }
      },
      // 雾
      fog(fogShow) {
        this.initWeatherEffect()
        this.fogShow = fogShow;
        if (fogShow) {
          this.weatherEffect.removeEffect();
          this.weatherEffect.addFogEffect();
        } else {
          this.weatherEffect.removeEffect();
        }
      },

      // ==================空间测量==============
      //初始化测量工具
      initMeasureTools() {
        //测距工具
        this.mdTool = new xt3d.Map3dTools.Measure.Distance(window.viewer, {
          startImgUrl: require("@/assets/map/start.png"), //起点图标
          endImgUrl: require("@/assets/map/end.png") //终点图标
        })
        //测高工具
        this.mhTool = new xt3d.Map3dTools.Measure.Height(window.viewer);
        //测面
        this.maTool = new xt3d.Map3dTools.Measure.Area(window.viewer);
      },
      //测距
      measureDistance() {
        if (this.mdTool) {
          this.measureClear();
        } else {
          this.initMeasureTools();
        }
        this.mdTool.activate();
      },
      //测面
      measureArea() {
        if (this.maTool) {
          this.measureClear();
        } else {
          this.initMeasureTools();
        }
        this.maTool.activate();
      },
      //测高
      measureAltitude() {
        if (this.mhTool) {
          this.measureClear();
        } else {
          this.initMeasureTools();
        }
        this.mhTool.activate();
      },
      //初始化绘制
      initEntityDraw() {
        this.entityDraw = new xt3d.Map3dTools.EntityDraw(window.viewer);
        this.entityDraw.DrawEndEvent.addEventListener((result, positions, drawType) => {
          result.remove();
          new xt3d.Map3dTools.PositionPick(window.viewer, positions[0], {
            imgUrl: require("../../../assets/map/maps_pointNew.png")
          })
        })
      },
      // 点位
      measurePoint(){
        if (this.entityDraw) {
          //this.measureClear();
        }else{
          this.initEntityDraw()
        }
        this.entityDraw.activate('Point');
      },
      measureClear(){
        this.mhTool.deactivate();
        this.mhTool.clear();
        this.mdTool.deactivate();
        this.mdTool.clear();
        this.maTool.deactivate();
        this.maTool.clear();
      },
      //快捷工具收起
      putaway() {
        this.btnshow = false;
        this.btnhide = true;
      },
      //快捷工具展开
      unfold() {
        this.btnshow = true;
        this.btnhide = false;
      },
      // ==================卷帘显示==============
      addSplitLayer(){
        let _that = this
        _that.removeSplitLayer();
        _that.showSplitLayer = true
        // 切换到2维，电子地图
        _that.mapTab(0)
        // 添加影像图至右边
        const basemapLayer = _that.basemapLayers[1]
        let splitLayer = _that.getLayer(basemapLayer.layers[0])
        window.xt3dInit.splitControl = new xt3d.SceneControl.ImageLayerSplit(window.viewer, splitLayer, Cesium.ImagerySplitDirection.RIGHT);
      },
      removeSplitLayer(){
        let _that = this
        _that.showSplitLayer = false
        if (window.xt3dInit.splitControl) {
          window.xt3dInit.splitControl.destroy();
          window.xt3dInit.splitControl = undefined;
        }
        // 切换到3维，电子地图
        _that.mapTab(3)
      },
      //打开相应的工具
      addMarkerBtn(e) {
        if (e == "1") {
          this.clickBtn = !this.clickBtn;
          this.clickBtn2 = false;
          this.clickBtn3 = false;
        } else if (e == "2") {
          this.clickBtn2 = !this.clickBtn2;
          this.clickBtn = false;
          this.clickBtn3 = false;
        } else if (e == "3") {
          this.clickBtn3 = !this.clickBtn3;
          this.clickBtn = false;
          this.clickBtn2 = false;
        }
        // this.Clear();
      },
      // ==================空间分析==============
      initAnalysisTool(){
        let _that = this
        _that.singleLineAnalysis = new xt3d.SpatialAnalysis.SightLine.SingleLine(window.viewer)
        _that.circleAnalysis = new xt3d.SpatialAnalysis.SightLine.Circle(window.viewer)
      },
      singleLineAnalysisStart() {
        let _that = this
        _that.clearAnalysis()
        _that.analysisClick("pointToPoint")
        _that.singleLineAnalysis.activate()
      },
      circleAnalysisStart() {
        let _that = this
        _that.clearAnalysis()
        _that.analysisClick("pointToOpposite")
        _that.circleAnalysis.activate()
      },
      clearAnalysis() {
        let _that = this
        _that.singleLineAnalysis.deactivate()
        _that.singleLineAnalysis.clear()
        _that.circleAnalysis.deactivate()
        _that.circleAnalysis.clear()
      },
      // ==================空间标绘==============
      //初始化绘制工具
      initDrawTool() {
        let _that = this;
        _that.drawHandleTool = new xt3d.LabelPlotting.EntityDraw(window.viewer);
        _that.drawHandleTool.DrawEndEvent.addEventListener((result, positions, drawType) => {
          result.remove();
          _that.addDrawResult(positions, drawType);
          console.log("绘制类型：" + drawType + "结果如下");
          console.log(positions)
        })
      },
      //添加绘制结果
      addDrawResult(positions, drawType) {
        switch (drawType) {
          case "Point":
            this.generatePoint(positions);
            break;
          case "Polyline":
            this.generatePolyline(positions);
            break;
          case "Polygon":
            this.generatePolygon(positions);
            break;
        }
      },
      //构造点
      generatePoint(positions) {
        let entity = window.viewer.entities.add({
          position: positions[0],
          billboard: {
            image: require("../../../assets/map/maps_point.png"),
            width: 32,
            height: 32,
            // scaleByDistance: new Cesium.NearFarScalar(300, 1, 1200, 0.4), //设置随图缩放距离和比例
            // distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 10000), //设置可见距离 10000米可见
            verticalOrigin: Cesium.VerticalOrigin.BOTTOM
          }
        })
      },
      //构造线
      generatePolyline(positions) {
        let entity = window.viewer.entities.add({
          polyline: {
            positions: positions,
            width: 2,
            material: new Cesium.PolylineDashMaterialProperty({
              color: Cesium.Color.YELLOW,
            }),
            depthFailMaterial: new Cesium.PolylineDashMaterialProperty({
              color: Cesium.Color.YELLOW,
            }),
          }
        })
      },
      //构造面
      generatePolygon(positions) {
        let entity = window.viewer.entities.add({
          polygon: {
            hierarchy: positions,
            material: Cesium.Color.RED.withAlpha(0.4),
            perPositionHeight: true
          },
          polyline: {
            positions: positions.concat(positions[0]),
            width: 1,
            material: new Cesium.PolylineDashMaterialProperty({
              color: Cesium.Color.YELLOW,
            })
          }
        })
      },


      //文字描述
      drawPointText() {
        //获取点击经纬度 和 文字描述 添加到点击位置上
        if (drawHandleTool.stop == false) {
          drawHandleTool.stop = true;
        }
        this.type = "4";

        if (this.type == "4") {
          handlerLocation = new Cesium.ScreenSpaceEventHandler(window.viewer.scene.canvas);
          handlerLocation.setInputAction(movement => {
            var position = window.viewer.scene.camera.pickEllipsoid(movement.position, window.viewer.scene.globe
                .ellipsoid);

            var ellipsoid = window.viewer.scene.globe.ellipsoid;
            var cartesian3 = new Cesium.Cartesian3(parseFloat(position.x), parseFloat(position.y),
                parseFloat(position.z));
            var cartographic = ellipsoid.cartesianToCartographic(cartesian3);
            var lat = Cesium.Math.toDegrees(cartographic.latitude).toString().substring(0, 10);
            var lng = Cesium.Math.toDegrees(cartographic.longitude).toString().substring(0, 10);

            if (this.pointText != "") {
              window.viewer.entities.add({
                position: Cesium.Cartesian3.fromDegrees(parseFloat(lng), parseFloat(lat), 10),
                label: {
                  text: this.pointText,
                  fillColor: Cesium.Color.RED
                }
              });

              //文字描述存入数据库

              let plott = lng.toString() + ',' + lat.toString();
              this.plottingSaveText(plott, "4", this.pointText);
            }

          }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
        }

      },

      //画点线面方法
      drawPointLinePlane1(value) {
        let _that = this;
        this.drawHandleTool.activate(type);
        //3d标点
        this.pointText = "";
        if (_that.drawHandleTool.stop) {
          _that.drawHandleTool.stop = false;
        }
        if (value == "first") {
          _that.type = "1";
          _that.drawHandleTool.draw({
                color: Cesium.Color.RED,
                pixelSize: 10,
                disableDepthTestDistance: Number.POSITIVE_INFINITY,
              },
              function (entity) {
                var ellipsoid = window.viewer.scene.globe.ellipsoid;
                var cartesian3 = new Cesium.Cartesian3(parseFloat(entity.position._value.x), parseFloat(
                    entity.position._value.y), parseFloat(entity.position._value.z));
                var cartographic = ellipsoid.cartesianToCartographic(cartesian3);
                var lat = Cesium.Math.toDegrees(cartographic.latitude);
                var lng = Cesium.Math.toDegrees(cartographic.longitude);
                var alt = Cesium.Math.toDegrees(cartographic.height);
                // _that.plott = entity.position._value.toString();
                let plott = lng.toString() + ',' + lat.toString();
                _that.plottingSave(plott, _that.type);
              }, Cesium.EV_DrawType.POINT
          );

        } else if (value == "second") {
          _that.type = "2";
          _that.drawHandleTool.draw({
                material: Cesium.Color.RED,
                width: 10,
              },
              function callback(entity) {
                let plott = '';
                for (let i = 0; i < entity.positions.length; i++) {
                  var ellipsoid = window.viewer.scene.globe.ellipsoid;
                  var cartesian3 = new Cesium.Cartesian3(parseFloat(entity.positions[i].x), parseFloat(
                      entity.positions[i].y), parseFloat(entity.positions[i].z));
                  var cartographic = ellipsoid.cartesianToCartographic(cartesian3);
                  var lat = Cesium.Math.toDegrees(cartographic.latitude);
                  var lng = Cesium.Math.toDegrees(cartographic.longitude);

                  if (i != 0) {
                    plott = plott + ',' + lng.toString() + ',' + lat.toString();
                  } else if (i == 0) {
                    plott = lng.toString() + ',' + lat.toString();
                  }

                }
                _that.plottingSave(plott, _that.type);
              },
              Cesium.EV_DrawType.POLYLINE
          );
        } else if (value == "third") {
          _that.type = "3";
          _that.drawHandleTool.draw({
                material: Cesium.Color.RED,
              },
              function callback(entity) {
                let plott = '';
                for (let i = 0; i < entity.positions.length; i++) {
                  var ellipsoid = window.viewer.scene.globe.ellipsoid;
                  var cartesian3 = new Cesium.Cartesian3(parseFloat(entity.positions[i].x), parseFloat(
                      entity.positions[i].y), parseFloat(entity.positions[i].z));
                  var cartographic = ellipsoid.cartesianToCartographic(cartesian3);
                  var lat = Cesium.Math.toDegrees(cartographic.latitude);
                  var lng = Cesium.Math.toDegrees(cartographic.longitude);

                  if (i != 0) {
                    plott = plott + ',' + lng.toString() + ',' + lat.toString();
                  } else if (i == 0) {
                    plott = lng.toString() + ',' + lat.toString();
                  }

                }
                _that.plottingSave(plott, _that.type);
              },
              Cesium.EV_DrawType.POLYGON
          );
        }
      },

      //画点线面方法
      drawPointLinePlane(value) {
        let _that = this;
        // 添加点
        if (value == "first") {
          _that.type = "1";
          _that.drawHandleTool.activate('Point')

        } else if (value == "second") {// 添加线
          _that.type = "2";
          _that.drawHandleTool.activate('Polyline')
        } else if (value == "third") {// 添加面
          _that.type = "3";
          _that.drawHandleTool.activate('Polygon')
        } else if (value == "1") {
          _that.type = "1";

          this.operation = '2';
        }
      },
      //地图出图
      png() {
        let exportFile = new xt3d.SceneDominate.ExportFile(window.viewer);
        exportFile.exportImage();
      },

      //框选
      circleSelect() {

      },
      stopSelect() {
        this.queryResults.forEach(item => {
          this.viewer.entities.remove(item);
        });
        this.queryResults = [];
        this.viewer.entities.remove(this.drawPoly);

        this.Clear();
      },
      //处理查询结果
      handleQueryResult(res) {
        //清除上一次结果
        //如果查询成功 那么返回的结果应该是一个geojson对象 类型为FeatureCollection
        res.features.forEach(item => {
          let coordinates = item.geometry.coordinates;
          const e = this.viewer.entities.add({
            position: Cesium.Cartesian3.fromDegrees(coordinates[0], coordinates[1], 0),
            billboard: {
              image: require("../../../assets/map/maps_point.png"),
              verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
              height: 44,
              width: 32,
            }
          });
          this.queryResults.push(e);
        })
      },

      //取消绘制
      None() {
        drawHandleTool.stop = true;
        this.dvBoxThreeClick("");
      },
      //清除
      Clear() {
        window.viewer.entities.removeAll();
        this.dvBoxTwoClick('');
        this.dvBoxThreeClick('');
        this.leftClear();
        this.operation = '1';
        this.reverseQueryData = [];
      },
      leftClear() {
        this.tableFlag = '0';
        this.form.search = '';
      },
      //符号选择
      li(e) {
        if (e == "1") {
          this.clickColor = "1";
          this.cub = ["1", "2"];
        } else if (e == "2") {
          this.clickColor = "2";
          this.cub = ["1", "1", "1", "1"];
        } else if (e == "3") {
          this.clickColor = "3";
          this.cub = ["1", "3", "1", "2"];
        } else if (e == "4") {
          this.clickColor = "4";
          this.cub = ["1", "2"];
        } else if (e == "5") {
          this.clickColor = "5";
          this.cub = ["1", "2", "2"];
        } else if (e == "6") {
          this.clickColor = "6";
          this.cub = ["1", "2", "3"];
        } else if (e == "m1") {
          this.clickColor = "7";
          this.cub = ["1", "2", "3"];
        } else if (e == "m2") {
          this.clickColor = "8";
          this.cub = ["1", "2", "3"];
        } else if (e == "m3") {
          this.clickColor = "9";
          this.cub = ["1", "2", "3"];
        }
      },

      //拖拽
      down(e) {
        var _this = this;
        this.clickdraw = this.$refs.clickdraw.$el;
        this.originX = e.clientX - this.clickdraw.offsetLeft;
        this.originY = e.clientY - this.clickdraw.offsetTop;

        document.onmousemove = function (e) {
          _this.clickdraw.style.left = e.clientX - _this.originX + "px";
          _this.clickdraw.style.top = e.clientY - _this.originY + "px";
        };
        document.onmouseup = function (e) {
          document.onmousemove = null;
          document.onmouseup = null;
        };
      },

      plottingNew() {
        this.plottingNewFlag = true;
      },

      //顶级按钮切换
      dvBoxClick(v) {
        let that = this
        that.dvBoxFlag = v;
        that.dvBoxTwoFlag = '';
        that.analysisValue = "";
        that.Clear();

        //通视
        if (that.dvBoxFlag == 'analysis') {
          that.initAnalysisTool()
        }

        //光照
        if (that.dvBoxFlag == 'shadows') {
          that.bshadows();
        }

        //收藏
        if (that.dvBoxFlag == 'collection') {
          that.getCollectAll();
        }

        //标绘
        if (that.dvBoxFlag == 'rosca') {
          //this.plottingNewClick();
          that.plottTucengSelectPlottTucengAll();
          that.mapTab(1);
          that.plottingNewFlag = false;
          that.initDrawTool();
        }

        //纠错
        if (that.dvBoxFlag == 'error') {
          that.operation = '1';
          that.getselectCatalogueTree();
        }
        if (that.dvBoxFlag == '') {
          that.cshadows();

          that.clearAnalysis()
        }
        if (that.dvBoxFlag != 'circleSelect') {
          // that.stopSelect();
        }
      },
      sliderMouseUp(e) {
        document.onmousemove = null;
      },
      sliderMouseDown(e) {
        let that = this
        let windowHeight = this.$refs.cesiumDiv.offsetHeight
        let windowWidth = this.$refs.cesiumDiv.offsetWidth
        document.onmousemove = function (e) {
          // 解决拖拽鼠标粘滞的问题
          if (e.preventDefault) {
            e.preventDefault();
          } else {
            e.returnValue = false;
          }
          switch (that.rollerShutterConfig.mode) {
            case 1:
            case 2:
              that.$refs.rollerShutterSlider.style.left = e.clientX + 'px';
              that.rollerShutterConfig.startX = e.clientX / windowWidth;
              break;
            case 3:
            case 4:
              that.$refs.rollerShutterSlider.style.top = e.clientY + 'px';
              that.rollerShutterConfig.startY = (windowHeight - e.clientY) / windowHeight;
              break;
          }
          that.setRollerShutterSplit(that.rollerShutterConfig);
        }
        document.onmouseup = function (e) {
          document.onmousemove = null;
          document.onmouseup = null;
        }
      },
      setRollerShutterSplit(rollerShutterConfig) {
        let that = this
        if (that.mapIndex < 3) {
          switch (that.rollerShutterConfig.mode) {
            case 1:
            case 2:
              window.viewer.scene.imagerySplitPosition.x = that.rollerShutterConfig.startX
              break;
            case 3:
            case 4:
              window.viewer.scene.imagerySplitPosition.y = that.rollerShutterConfig.startY
              break;
          }
        } else {
          let startX = rollerShutterConfig.startX;
          let startY = rollerShutterConfig.startY;
          let mode = rollerShutterConfig.mode;
          let e3mLayer = rollerShutterConfig.e3mLayer;
          // 左右卷帘使用left slider滑动，上下卷帘使用top slider滑动
          switch (mode) {
            case 1:
              Cesium.Cartesian4.unpack([startX, 0, 1, 1], 0, e3mLayer.rollerRegion);
              break;
            case 2:
              Cesium.Cartesian4.unpack([0, 0, startX, 1], 0, e3mLayer.rollerRegion);
              break;
            case 3:
              Cesium.Cartesian4.unpack([0, startY, 1, 1], 0, e3mLayer.rollerRegion);
              break;
            case 4:
              Cesium.Cartesian4.unpack([0, 0, 1, startY], 0, e3mLayer.rollerRegion);
              break;
            default:
              Cesium.Cartesian4.unpack([0, 0, 1, 1], 0, laye3mLayerer.rollerRegion);
              break;
          }
        }
      },

      dvBoxTwoClick(v) {
        this.dvBoxTwoFlag = v;
        if (v == 'zero') {
          this.measurePoint();
        } else if (v == 'first') {
          this.measureAltitude();
        } else if (v == 'second') {
          this.measureDistance();
        } else if (v == 'third') {
          this.measureArea();
        } else if (v == 'forth') {
          this.azimuthDegreeBtn();
        } else if (v == 'transcribe') {
          this.transcribe();
        } else if (v == 'error1') {
          this.getErrorAll();
        }
        this.operation = '1';
      },
      dvBoxThreeClick(v) {
        this.dvBoxThreeFlag = v;
        if (v == 'first1') {
          this.drawPointLinePlane('first');
        } else if (v == 'second1') {
          this.drawPointLinePlane('second');
        } else if (v == 'third1') {
          this.drawPointLinePlane('third');
        } else if (v == 'four1') {
          this.drawPointText();
        }
      },

      //区县乡镇定位
      locationChange(v) {
        let that = this
        if (v.length == 0) {
          window.viewer.entities.removeAll()
          if (that.wall && window.viewer.entities.contains(that.wall)) {
            window.viewer.entities.remove(that.wall);
          }
          if (that.wallName && window.viewer.entities.contains(that.wallName)) {
            window.viewer.entities.remove(that.wallName);
          }
          return
        }
        let name = v[v.length - 1]
        let code = "130274"
        let area = '县.json'
        for (let i = 0; i < this.optionsLocation.length; i++) {
          let xian = this.optionsLocation[i]
          if (xian.value == v[0]) {
            if (v.length == 1) { // 全区
              code = xian.code
              area = xian.area
              break;
            }
            for (let j = 0; j < xian.children.length; j++) {
              let xiang = xian.children[j]
              if (xiang.value == v[1]) {
                if (v.length == 2) { // 乡镇
                  code = xiang.code
                  area = xiang.area
                  break;
                }
                for (let k = 0; k < xiang.children.length; k++) {
                  let cun = xiang.children[k]
                  if (cun.value == v[2]) {
                    if (v.length == 3) { // 村
                      code = cun.code
                      area = cun.area
                      break;
                    }
                  }
                }
                break;
              }
            }
            break;
          }
        }
        // 查询json
        const res = require("../../../assets/geojson/" + area)
        if (area == "村.json") {
          if (res && res.features) {
            for (let i = 0; i < res.features.length; i++) {
              const feature = res.features[i]
              if (feature.properties["行政区代码"] == code) {

                if (that.wall && window.viewer.entities.contains(that.wall)) {
                  window.viewer.entities.remove(that.wall);
                }
                if (that.wallName && window.viewer.entities.contains(that.wallName)) {
                  window.viewer.entities.remove(that.wallName);
                }
                // 添加范围
                let positions = that.getJsonDegreesArrayHeights(feature, 500);
                let dw1 = new Cesium.EV_DynamicWall({
                  viewer: window.viewer,
                  id: feature.properties["名称"],
                  positions: positions,
                  color: Cesium.Color.fromCssColorString("rgb(14,25,224)"),
                  duration: 3 * 1500,
                  direction: "Motionless"
                })
                // that.wall = dw1.addWall()
                let n = Cesium.Cartographic.fromCartesian(Cesium.BoundingSphere.fromPoints(Cesium.Cartesian3.fromDegreesArrayHeights(positions)).center),
                    l = Cesium.Math.toDegrees(n.longitude),
                    a = Cesium.Math.toDegrees(n.latitude);
                that.wallName = window.viewer.entities.add({
                  position: Cesium.Cartesian3.fromDegrees(l, a, 530),
                  label: {
                    text: feature.properties["名称"],
                    font: '300 28px MicroSoft YaHei',
                    fillColor: Cesium.Color.RED,        //字体颜色
                    // style: Cesium.LabelStyle.FILL
                    // outlineColor: Cesium.Color.BLACK,
                    // outlineWidth: 2
                  }
                })
                // 定位
                window.viewer.zoomTo(that.wall);

              }
            }
          }
        } else {
          if (res && res.features) {
            for (let i = 0; i < res.features.length; i++) {
              const feature = res.features[i]
              if (feature.properties.CODE == code) {
                window.viewer.entities.removeAll()
                if (that.wall && window.viewer.entities.contains(that.wall)) {
                  window.viewer.entities.remove(that.wall);
                }
                if (that.wallName && window.viewer.entities.contains(that.wallName)) {
                  window.viewer.entities.remove(that.wallName);
                }
                // 添加范围
                let positions = that.getJsonDegreesArrayHeights(feature, 1000);

                let ps = that.coordinateToPositions(feature, 100);
                let walleX = new xt3d.WallObject.FlowWall(window.viewer, ps, {
                  id: feature.properties.NAME,
                  wallHeight: 400,
                  wallColor: Cesium.Color.fromCssColorString("#0BFF0D"),
                  duration: 2000,
                  materialType: xt3d.WallObject.MaterialTypes.LINEFLOW,
                });

                let n = Cesium.Cartographic.fromCartesian(Cesium.BoundingSphere.fromPoints(Cesium.Cartesian3.fromDegreesArrayHeights(positions)).center),
                    l = Cesium.Math.toDegrees(n.longitude),
                    a = Cesium.Math.toDegrees(n.latitude);
                that.wallName = window.viewer.entities.add({
                  position: Cesium.Cartesian3.fromDegrees(l, a, 230),
                  label: {
                    text: feature.properties.NAME,
                    font: '300 28px MicroSoft YaHei',
                    fillColor: Cesium.Color.WHITE,        //字体颜色
                    // style: Cesium.LabelStyle.FILL
                    // outlineColor: Cesium.Color.BLACK,
                    // outlineWidth: 2
                  }
                })
                let offY = 0.12
                let height = 10000
                if(area == '县.json'){
                  offY = 0.5
                  height = 40000
                }
                // 定位
                window.viewer.scene.camera.flyTo({
                  destination: Cesium.Cartesian3.fromDegrees(l, a-offY, height),
                  duration: 1,
                  orientation: {
                    heading: 0,
                    pitch: -0.7,
                    roll: 0,
                  }
                })
              }
            }
          }
        }

      },
      //初始定位
      initial() {
        window.viewer.scene.camera.flyTo({
          // destination: new Cesium.Cartesian3.fromDegrees(118.5350037,39.7803993, 50000),
          // duration: 1
          destination: new Cesium.Cartesian3.fromDegrees(118.8876, 39.22000372, 1000),
          duration: 1,
          orientation: {
            heading: 0,
            pitch: -0.5,
            roll: 0,
          },
        });
      },

      //查询所以收藏
      getCollectAll() {
        $axios({
          url: '/collect/getCollectAll',
        }).then(res => {
          if (res.code == 200) {
            this.optionsChoice = res.data;
          }
        })
      },
      //选择收藏项
      changeCollection(v) {
        this.valueChoiceId = v;
        for (let i = 0; i < this.optionsChoice.length; i++) {
          if (this.optionsChoice[i].id == v) {
            window.viewer.scene.camera.flyTo({
              destination: new Cesium.Cartesian3.fromDegrees(
                  parseFloat(this.optionsChoice[i].longitude),
                  parseFloat(this.optionsChoice[i].latitude),
                  parseFloat(this.optionsChoice[i].height)),
              orientation: {
                heading:  parseFloat(this.optionsChoice[i].viewDirection),
                pitch:  parseFloat(this.optionsChoice[i].anglePitch),
                roll: 0,
              }
            });
          }
        }
        this.dvBoxClick('');
        this.dvBoxTwoClick('');
      },
      //删除收藏
      delCollection() {
        if (this.valueChoiceId != '') {
          $axios({
            url: '/collect/delCollect/' + this.valueChoiceId,
          }).then(res => {
            this.getCollectAll();
            this.dvBoxTwoClick('');
            this.$message({
              message: '操作成功',
              type: 'success'
            });
          })
        }
      },
      //添加收藏
      addCollection() {
        const camera = window.viewer.scene.camera
        const cartographic = Cesium.Cartographic.fromCartesian(camera.position)
        const longitude = Cesium.Math.toDegrees(cartographic.longitude)
        const latitude = Cesium.Math.toDegrees(cartographic.latitude)
        let height = cartographic.height;  //高度
        let viewHeight = cartographic.height; //视点高
        let viewDirection = camera.heading; //视角方向
        let anglePitch = camera.pitch  // 俯仰角
        let thematicMapId = this.valueChoiceId;
        if (this.collectionName != '') {
          $axios({
            method: 'POST',
            url: '/collect/addCollect',
            //data: data
            data: {
              id: Number(Math.random().toString().substr(3, 3) + Date.now()),
              collectName: this.collectionName,
              longitude: longitude,
              latitude: latitude,
              height: height,
              viewHeight: viewHeight,
              viewDirection: viewDirection,
              anglePitch: anglePitch,
              thematicMapId: thematicMapId
            }
          }).then(res => {
            if (res.code == 200) {
              this.$message({
                message: '操作成功',
                type: 'success'
              });
              this.dvBoxTwoClick('');
              this.getCollectAll();
            }
          })
        }
      },
      //查询图层
      plottTucengSelectPlottTucengAll() {
        this.coverage = [];
        $axios({
          url: '/plottTuceng/selectPlottTucengAll',
          params: {}
        }).then(res => {
          if (res.code == 200) {
            this.coverageValue = res.data[0].name;
            this.coverageId = res.data[0].id;
            for (let i = 0; i < res.data.length; i++) {
              let arr = {
                value: res.data[i].id,
                label: res.data[i].name
              }
              this.coverage.push(arr);
            }
            this.getPlottAll(res.data[0].id);
          }
        })
      },
      //切换图层
      changeCoverage(v) {
        this.Clear();
        this.coverageId = v;
        this.getPlottAll(v);
      },
      //新建图层
      plottingNewClick() {
        this.plottingNewFlag = false;
        $axios({
          method: 'POST',
          url: '/plottTuceng/addPlottTuceng',
          data: {
            id: Number(Math.random().toString().substr(3, 3) + Date.now()),
            name: this.plottingInput,
          }
        }).then(res => {
          this.plottTucengSelectPlottTucengAll();
        })
      },
      //删除图层
      plottingDel() {
        $axios({
          url: '/plottTuceng/delPlottTucengById'  ,
          params: {
            id: this.coverageId
          }
        }).then(res => {
          this.plottTucengSelectPlottTucengAll();
        })
      },
      //查询标绘
      getPlottAll(id) {
        $axios({
          method: 'GET',
          url: '/plottData/getPlottAll' ,
          params: {
            id: id
          }
        }).then(res => {
          let data = res.data;
          if (res.code == '200') {
            for (let i = 0; i < data.length; i++) {
              if (data[i].type == '1') {
                data[i].plott = data[i].plott.replace('(', ''); //去掉左括号
                data[i].plott = data[i].plott.replace(')', ''); //去掉右括号
                data[i].plott = data[i].plott.split(',');
                window.viewer.entities.add({
                  position: Cesium.Cartesian3.fromDegrees(parseFloat(data[i].plott[0]),
                      parseFloat(data[i].plott[1]), 1000),
                  point: {
                    pixelSize: 10,
                    color: Cesium.Color.fromCssColorString('#ff0000'),
                    show: true
                  }
                });
              }
              if (data[i].type == '2') {
                data[i].plott = data[i].plott.replace('(', ''); //去掉左括号
                data[i].plott = data[i].plott.replace(')', ''); //去掉右括号
                data[i].plott = data[i].plott.split(',');
                let plott = [];
                for (let j = 0; j < data[i].plott.length; j++) {
                  plott.push(parseFloat(data[i].plott[j]));
                }
                window.viewer.entities.add({
                  polyline: {
                    positions: Cesium.Cartesian3.fromDegreesArray(plott),
                    width: 2,
                    material: Cesium.Color.fromCssColorString('#ff0000'),
                    show: true
                  }
                })
              }

              if (data[i].type == '3') {
                data[i].plott = data[i].plott.replace('(', ''); //去掉左括号
                data[i].plott = data[i].plott.replace(')', ''); //去掉右括号
                data[i].plott = data[i].plott.split(',');
                let plott = [];
                for (let j = 0; j < data[i].plott.length; j++) {
                  plott.push(parseFloat(data[i].plott[j]));
                }
                window.viewer.entities.add({
                  polygon: {
                    hierarchy: {
                      positions: Cesium.Cartesian3.fromDegreesArray(plott)
                    },
                    clampToGround: true,
                    material: Cesium.Color.fromCssColorString('#ff0000'),
                    show: true
                  }
                });
              }

              if (data[i].type == '4') {
                let plottList = data[i].plott.split(",");

                window.viewer.entities.add({
                  position: Cesium.Cartesian3.fromDegrees(parseFloat(plottList[0]), parseFloat(plottList[1]), 10),
                  label: {
                    text: data[i].plottText,
                    fillColor: Cesium.Color.RED
                  }
                });

              }

            }
          }
        })
      },
      //添加文字标注
      plottingSaveText(plott, type, text) {
        $axios({
          method: 'POST',
          url: '/plott/addPlott',
          data: {
            id: Number(Math.random().toString().substr(3, 3) + Date.now()),
            type: type,
            plott: plott,
            plottText: text,
            plottDataId: this.coverageId
          }
        }).then(res => {

        })
      },
      //添加标绘
      plottingSave(plott, type) {
        $axios({
          method: 'POST',
          url: '/plott/addPlott',
          data: {
            id: Number(Math.random().toString().substr(3, 3) + Date.now()),
            type: type,
            plott: plott,
            plottDataId: this.coverageId
          }
        }).then(res => {

        })
      },
      //纠错保存
      errorSave(v) {
        if (this.operation != '2') {
          this.operation = v;
        }

        this.correctorId = parseInt(this.$store.state.Authentication.uid);
        this.corrector = this.$store.state.Authentication.virtualName;

        this.personId = parseInt(this.$store.state.Authentication.uid);
        this.person = this.$store.state.Authentication.virtualName;
        let date = new Date()
        let year = date.getFullYear();
        let month = date.getMonth();
        let day = date.getDate();

        month = month < 9 ? '0' + (month + 1) : month + 1;
        day = day < 10 ? '0' + day : day;
        this.errorDate = year + '-' + month + '-' + day;

        for (let i = 0; i < this.tcData.length; i++) {
          this.attribute = this.attribute + this.tcData[i].b;
          if (i != this.tcData.length - 1) {
            this.attribute = this.attribute + ','
          }
        }

        $axios({
          method: 'POST',
          url: '/errorCorrection/addErrorCorrection',
          data: {
            id: Number(Math.random().toString().substr(3, 3) + Date.now()),
            type: this.type,
            plott: this.plott,
            plottText: this.errorTextarea,
            phone: this.errorPhone,
            email: this.errorMailbox,
            correctorId: parseInt(this.correctorId),
            corrector: this.corrector,
            unit: this.unit,
            address: this.address,
            serviceId: this.serviceId,
            serviceName: this.serviceName,
            serviceType: this.serviceType,
            serviceDepartment: this.serviceDepartment,
            serviceTopics: this.serviceTopics,
            serviceStatus: this.serviceStatus,
            personId: this.personId,
            person: this.person,
            errorDate: this.errorDate,
            state: this.state,

            errorCoordinate: this.errorCoordinate,
            recordId: this.recordId,
            operation: this.operation,
            attribute: this.attribute,

            kind: "1",
          }
        }).then(res => {
          if (res.code == 200) {
            this.Clear();
            this.dvBoxClick('');
            this.getErrorAll();
            this.$message({
              message: '操作成功',
              type: 'success'
            });
            this.operation = '1';
          }
        })
      },
      //查询纠错记录
      getErrorAll() {
        this.errorData = []; // 清空纠错记录数组
        $axios({
          url: '/errorCorrection/getErrorCorrectionAll',
        }).then(res => {
          if (res.code == 200) {
            for (let i = 0; i < res.data.length; i++) {
              if (res.data[i].kind == '1' && this.$store.state.Authentication.virtualName == res
                  .data[i].corrector) {
                this.errorData.push(res.data[i]);
              }
            }
          }
        })
      },
      getselectCatalogueTree() {
        //查询所有图层
        this.optionsError = []; // 清空纠错记录数组
        $axios({
          url: '/plott/catalogue/selectCatalogueTree/0',
        }).then(res => {
          if (res.code == 200) {
            for (let i = 0; i < res.data.length; i++) {
              for (let j = 0; j < res.data[i].catalogueVos.length; j++) {
                let arr = {
                  value: res.data[i].catalogueVos[j].id,
                  label: res.data[i].catalogueVos[j].name
                }
                this.optionsError.push(arr);
              }
            }
          }
        })
      },
      changeError(v) {
        //纠错图层选择
        for (let i = 0; i < this.optionsError.length; i++) {
          if (this.optionsError[i].value == v) {
            this.serviceId = parseInt(this.optionsError[i].id);
            this.serviceName = this.optionsError[i].name;
          }
        }
      },

      fuzzyMatching() {
        this.tableFlag = '1';
        this.locationInfos = [];
        $axios1({
          // url: '/earthview/rest/services/geocodeserver/geoCodeQuery',
          // url: 'http://172.16.210.4:8708/geocoder/data/geoCodeQuery',
          url: 'http://127.0.0.1:8708/geocoder/data/geoCodeQuery',
          params: {
            address: this.form.search,
            location: 118.8876 + ',' + 39.22000372,
            radius: 2000,
            output: 'json'
          }
        }).then(res => {
          if (res.status == 200) {
            let data = [];
            data.push(res.data.locationInfos);
            for (let i = 1; i <= res.data.count; i++) {
              let arr = [];
              arr = data[0][i].location.split(',');
              window.viewer.entities.add({
                id: data[0][i].name,
                position: Cesium.Cartesian3.fromDegrees(parseFloat(arr[0]), parseFloat(arr[
                    1]), 80),
                billboard: {
                  image: require("../../../assets/map/maps_point.png"),
                  width: 32,
                  height: 32
                }
              });
              let arrTable = {
                areaCode: data[0][i].areaCode,
                cityCode: data[0][i].cityCode,
                detailedAddress: data[0][i].detailedAddress,
                level: data[0][i].level,
                name: data[0][i].name,
                parentCode: data[0][i].parentCode,
                shortName: data[0][i].shortName,
                zipCode: data[0][i].zipCode,
                lng: arr[0],
                lat: arr[1]
              }
              this.locationInfos.push(arrTable);
            }
          }
        })
      },

      reverseQuery() {
        let that = this
        that.reverseQueryData = [];
        window.viewer.entities.removeAll();
        location= that.lng + "," + that.lat;
            let url = "http://42.192.134.169:8090/geoserver/xt3d/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=xt3d:querypoly&maxFeatures=50&outputFormat=json";
        xt3d.GeoServerPlugin.pointQueryPoint(position, url).then(res => {
          this.handleQueryResult(res);
        })
        $axios1({
          url: '/earthview/rest/services/geocodeserver/reGeoCodeQuery',
          params: {
            location: that.lng + "," + that.lat,
            radius: '10'
          }
        }).then(res => {
          if (res.data.count != 0) {
            let data = [];
            data.push(res.data.locationInfos);
            let arr = [];
            arr = data[0][1].location.split(',');
            if (arr.length > 0) {
              that.lng = parseFloat(arr[0])
              that.lat = parseFloat(arr[1])
            }
            window.viewer.entities.add({
              position: Cesium.Cartesian3.fromDegrees(parseFloat(that.lng), parseFloat(that.lat), 210),
              billboard: {
                image: require("../../../assets/map/maps_point.png"),
                width: 32,
                height: 32,
                pixelOffset: new Cesium.Cartesian2(0, -16), // default: (0, 0)
              }
            });
            that.reverseQueryData = data[0][1];
          }
        })
      },

      locationClick() {
        handlerLocation = new Cesium.ScreenSpaceEventHandler(window.viewer.scene.canvas);
        handlerLocation.setInputAction(movement => {
          var position = window.viewer.scene.camera.pickEllipsoid(movement.position, window.viewer.scene.globe
              .ellipsoid);

          var ellipsoid = window.viewer.scene.globe.ellipsoid;
          var cartesian3 = new Cesium.Cartesian3(parseFloat(position.x), parseFloat(position.y),
              parseFloat(position.z));
          var cartographic = ellipsoid.cartesianToCartographic(cartesian3);
          this.lat = Cesium.Math.toDegrees(cartographic.latitude).toString().substring(0, 10);
          this.lng = Cesium.Math.toDegrees(cartographic.longitude).toString().substring(0, 10);

          if (this.dvBoxFlag == 'attribute') {
            this.reverseQuery();
          }
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
      },

      shadowsChange() {
        this.bshadows();
      },
      //开日照
      bshadows() {
        window.viewer.scene.globe.enableLighting = true;
        window.viewer.shadows = true;
        window.viewer.terrainShadows = Cesium.ShadowMode.RECEIVE_ONLY
        window.viewer.shadowMap.darkness = 0.2 //阴影透明度--越大越透明

        inter = setInterval(() => {
          // 改变时间设置光照效果
          let date = new Date(this.shadowsTime).getTime()
          let utc = Cesium.JulianDate.fromDate(new Date(date))
          //北京时间=UTC+8=GMT+8 不用加8
          window.viewer.clockViewModel.currentTime = Cesium.JulianDate.addHours(utc, 0, new Cesium.JulianDate())
        }, 100)
      },
      //关闭日照
      cshadows() {
        window.viewer.scene.globe.enableLighting = false
        window.viewer.shadows = false
        window.viewer.terrainShadows = Cesium.ShadowMode.DISABLED
        if (inter) {
          clearInterval(inter)
          inter = null
        }
      },

      locationInfos1RowClick(row) {
        if (this.oldNew == '新') {
          this.oldNew = '旧'
        }
        if (this.oldNew == '旧') {
          this.oldNew = '新'
        }
        window.viewer.entities.removeById('新');
        window.viewer.entities.removeById('旧');
        if(this.oldRow.name!=""){
          window.viewer.entities.removeById(this.oldRow.name)
        }

        // window.viewer.entities.add({
        //   id: this.oldRow.name,
        //   position: Cesium.Cartesian3.fromDegrees(parseFloat(this.oldRow.lng), parseFloat(this.oldRow.lat), 90),
        //   billboard: {
        //     image: require("../../../assets/map/maps_point.png"),
        //     width: 32,
        //     height: 32
        //   }
        // });
        // 移除旧的红色图标
        window.viewer.entities.removeById(row.name)
        // 添加新的蓝色图标
        window.viewer.entities.add({
          id: row.name,
          position: Cesium.Cartesian3.fromDegrees(parseFloat(row.lng), parseFloat(row.lat), 90),
          billboard: {
            image: require("../../../assets/map/maps_pointNew.png"),
            width: 32,
            height: 32
          }
        });

        window.viewer.scene.camera.flyTo({
          destination: new Cesium.Cartesian3.fromDegrees(parseFloat(row.lng), parseFloat(row.lat), 500),
          duration: 0,
          orientation: {
            heading: 0,
            pitch: -1.57,
            roll: 0,
          },
          complete: function callback() {
          },
        });

        this.oldRow = row;
      },

      //获取坐标串
      getDegreesArrayHeights(the_geom, height) {
        the_geom = the_geom.replaceAll('(','')
        the_geom = the_geom.replaceAll(')','')
        the_geom = the_geom.replaceAll(', ',',')
        if (the_geom.includes( "MULTIPOLYGON")) {
          the_geom =   the_geom.replace('MULTIPOLYGON ','')
        }  if (the_geom.includes( "POLYGON")) {
          the_geom = the_geom.replace('POLYGON ','')
        }
        let degreesArrayHeights = [];
        let coordinates = the_geom.split(',')
        for (let i = 0; i < coordinates.length; i++) {
          const element = coordinates[i].split(' ');
          degreesArrayHeights.push(Number(element[0]));
          degreesArrayHeights.push(Number(element[1]));
          degreesArrayHeights.push(height || 0);
        }
        return degreesArrayHeights;
      },
      //获取坐标串
      getJsonDegreesArrayHeights2(feature) {
        let degreesArrayHeights = [];
        let coordinates;
        if (feature.geometry.type == "MultiPolygon") {
          coordinates = feature.geometry.coordinates[0][0];
        } else if (feature.geometry.type == "Polygon") {
          coordinates = feature.geometry.coordinates[0];
        }
        //坐标串转为需要的格式[x,y,z,x,y,z....]
        for (let i = 0; i < coordinates.length; i++) {
          const element = coordinates[i];
          degreesArrayHeights.push(element[0]);
          degreesArrayHeights.push(element[1]);
        }

        return degreesArrayHeights;
      },
      //获取坐标串
      getJsonDegreesArrayHeights(feature, height) {
        let degreesArrayHeights = [];
        let coordinates;
        if (feature.geometry.type == "MultiPolygon") {
          coordinates = feature.geometry.coordinates[0][0];
        } else if (feature.geometry.type == "Polygon") {
          coordinates = feature.geometry.coordinates[0];
        }
        //坐标串转为需要的格式[x,y,z,x,y,z....]
        for (let i = 0; i < coordinates.length; i++) {
          const element = coordinates[i];
          degreesArrayHeights.push(element[0]);
          degreesArrayHeights.push(element[1]);
          degreesArrayHeights.push(height || 0);
        }

        return degreesArrayHeights;
      },
      //坐标转换
      coordinateToPositions(feature, height) {
        let positions = [];
        if (feature.geometry.type == "MultiPolygon") {
          feature.geometry.coordinates.map(e => {
            e.map(d => {
              d.map(c => {
                positions.push(Cesium.Cartesian3.fromDegrees(c[0], c[1], height));
              });
            });
          });
        }else if (feature.geometry.type == "Polygon") {
          feature.geometry.coordinates[0].map(c => {
            positions.push(Cesium.Cartesian3.fromDegrees(c[0], c[1], height));
          });
        }


        return positions;
      }


		}
	};
</script>

<style lang="scss" scoped>
#cesiumDiv{
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: transparent;
}
.vertical-slider {
  position: absolute;
  left: 50%;
  top: 0px;
  background-color: #005aca;
  width: 5px;
  height: 100%;
  z-index: 5;
}
.vertical-slider:hover {
  cursor: ew-resize;
}
.horizontal-slider {
  position: absolute;
  left: 0;
  top: 50%;
  background-color: #005aca;
  width: 100%;
  height: 5px;
  z-index: 9999;
}
.horizontal-slider:hover{
  cursor: ns-resize;
}
	.color1 {
		color: #0081ff;
	}

	.color2 {
		color: #111;
	}

	.my-map {
		display: flex;
		position: relative;
		height: calc(100vh - 160px);
		background-color: #000000;

		.tool {
			width: 570px;
			height: 76px;
			position: absolute;
			top: 30px;
			left: 80px;
			z-index: 9;

			.toolbar {
				margin: 5px 5px 5px 8px;
				font-size: 14px;

				.el-button {
					position: relative;
					left: 0;
					width: 36px !important;
					height: 36px !important;
          border-radius: 4px;
          border: 1px solid #005aca;
          background-color: #F5F7FA;
          color: #000000;
					padding: 8px;
				}

				.icon {
					cursor: pointer;
					color: #0081ff;
					text-align: center;
				}

				.btn-group {
					width: 53px;
					height: 66px;
					margin-left: 15px;
					font-size: 12px;
					float: left;
					text-align: center;
					position: relative;

					.draw {
						display: flex;
						justify-content: space-between;
						position: absolute;
						left: 50%;
						transform: translate(-50%);
					}
				}

				.btn-group>p {
					margin-top: 5px;
					color: #fff;
					font-family: serif;
					font-weight: bold !important;
				}
			}
		}

		.map-layers-cut {
			position: absolute;
			z-index: 3;
			right: 10px;
			bottom: 10px;
		}

		.map-search {
			position: absolute;
			padding: 0 0px;
			z-index: 9;
			left: 10px;
			top: 15px;
		}

		.coverage {
			width: 200px;
			position: relative;
			top: 5px;
			// left: 0px;
			// top: 55px;
			// padding: 0 10px;
			z-index: 9;

			.el-select {
				width: 100%;
			}
		}
	}

	.my-el-dialog {
		margin: -20px 0;
		height: calc(100vh - 250px);

		.img-0 {
			width: 100%;
			height: 144px;
		}

		.img-1 {
			width: 100%;
			height: 1500px;
		}

		.my-el-dialog-def {
			height: 100%;
			overflow-y: auto;
		}
	}

	.buttonBox {
		position: absolute;
		top: 10px;
		right: 10px;
		color: #000000;
    border-radius: 4px;
    border: 1px solid #005aca;
		background-color: #F5F7FA;
	}

	//按钮
	.dv-border-box1 {
		float: right;
		z-index: 99;
		margin: 5px;
		height: 40px;
		width: 70px;
		text-align: center;
		border-radius: 10px;
	}

	.dv-border-box1 div {
		position: relative;
		top: 15%;
		font-size: 12px;
		color: #000000;
		// background-color: red;
	}

	//活动按钮
	.dv-border-box1-select {
		float: right;
		z-index: 99;
		margin: 5px;
		height: 40px;
		width: 70px;
		text-align: center;
		// border: 1px solid #FFFFFF;
		// background-color: #DDEE33;
		border-radius: 10px;
	}

	.dv-border-box1-select div {
		position: relative;
		top: 15%;
		font-size: 12px;
		color: #005aca;
		// background-color: red;
	}

	.lsw-split-line {
		float: right;
		background-color: #005aca;
		margin-top: 6px;
		width: 1px;
		height: 35px;
	}

	//-------------------------------
	//按钮
	.dv-border-box {
		float: right;
		z-index: 99;
		margin: 5px;
		height: 40px;
		width: 70px;
		text-align: center;
		border: 1px solid #FFFFFF;
		background-color: rgb(0, 90, 202);
		border-radius: 10px;
	}

	.dv-border-box span {
		position: relative;
		top: 25%;
		font-size: 14px;
		color: #FFFFFF;
	}

	//活动按钮
	.dv-border-box-select {
		float: right;
		z-index: 99;
		margin: 5px;
		height: 40px;
		width: 70px;
		text-align: center;
		border: 1px solid #FFFFFF;
		background-color: #DDEE33;
		border-radius: 10px;
	}

	.dv-border-box-select span {
		position: relative;
		top: 25%;
		font-size: 12px;
		color: #000000;
		// background-color: red;
	}

	//-------------------------------

	.operationBox {
		position: absolute;
    width: 700px;
		right: 20px;
		top: 60px;
		text-align: right;
	}

	// rgba(63, 94, 127,0.7)
	.lsw-index-error-box {
    position: absolute;
    padding: 5px 10px 5px 10px;
    right: 0px;
    height: 500px;
    border-radius: 4px;
    border: 1px solid #005aca;
    background-color: #F5F7FA;
    color: #000000;
    z-index: 9;
    width: 350px;
    margin-top: 50px;
  }

	.lsw-pop-up-box {
		position: relative;
    width: 600px;
		padding: 5px;
		margin-top: 10px;
		right: 0px;
    border-radius: 4px;
    border: 1px solid #005aca;
		background-color: #F5F7FA;
		z-index: 9;
		color: #000000;
	}

	//滚动条
	.lsw-scroll {
		overflow-y: scroll;
	}

	.lsw-scroll::-webkit-scrollbar {
		display: none;
	}

	.lonLat {
		z-index: 2;
		position: absolute;
		bottom: 10px;
		left: 1%;
		width: 650px;
		color: #FFFFFF;
	}

	.lsw-geocoding-box-table {
		position: absolute;
		top: 60px;
		height: 400px;
		width: 500px;
		left: 10px;
    border-radius: 4px;
    border: 1px solid #005aca;
    background-color: #F5F7FA;
    color: #909399;
		overflow-y: scroll;
	}

.lsw-geocoding-box-table1 {
  position: absolute;
  top: 460px;
  height: 30px;
  width: 500px;
  left: 10px;
  line-height: 30px;
  border-radius: 4px;
  border: 1px solid #005aca;
  background-color: #F5F7FA;
  color: #909399;
}

	//滚动条
	.lsw-geocoding-box-table::-webkit-scrollbar {
		display: none;
	}
</style>
